<template>
	
	<el-row> <!--tr-->
		<el-col :span="8">    <!--td-->
			
		</el-col>
		<el-col :span="8">    <!--td-->
			<h1 align="center">后台管理系统</h1>
			<el-form :model="userInfo" label-width="auto" style="max-width: 600px">
			    <el-form-item >
			      <el-input v-model="userInfo.userName" placeholder="请输入用户名" />
			    </el-form-item>
			    <el-form-item >
			      <el-input v-model="userInfo.password" placeholder="请输入密码" />
			    </el-form-item>
				
			    <el-form-item>
			      <el-button style="width: 100%;" type="primary" @click="onSubmit">登录</el-button>
			    </el-form-item>
			  </el-form>
			
		</el-col>
		<el-col :span="8">    <!--td-->
			
		</el-col>
	</el-row> 
	
	
</template>

<script setup>
	import {useloginUserStore} from '../store/loginUserInfo.js' 
	import {ref,getCurrentInstance} from 'vue'
	import {useRouter} from 'vue-router'
	import { ElMessage } from 'element-plus'
	
	const userInfoStroe = useloginUserStore();  //导入store中的数据，就可以直接访问store中定义数据
	
	// do not use same name with ref
	const userInfo = ref({
	  userName: 'sysManager',
	  password:'123456'
	  
	})
	
	let {proxy} = getCurrentInstance();
	
	let router = useRouter();
	
	const onSubmit = () => {
		
		proxy.$axios.get("/sysUserController/userLogin",{params:userInfo.value})
		.then((serverData)=>{
			if (serverData.data.code==0){
				console.log("登录用户信息为:",serverData.data.data);
				// router.replace("/home")
			//	window.sessionStorage.setItem("sessionuserId",serverData.data.data.user_id);
				
				//window.localStorage.setItem("localstorage",JSON.stringify(serverData.data.data))
				
				//把服务端返回的用户数据放到store中,这样就可以在任意组件中访问到store中存储的数据
				userInfoStroe.user_id = serverData.data.data.user_id;
				userInfoStroe.username = serverData.data.data.username;
				userInfoStroe.email = serverData.data.data.email;
				userInfoStroe.mobile = serverData.data.data.mobile;
				userInfoStroe.saTokenInfo = serverData.data.saTokenInfo;
				router.replace({path:"/home",query:{userId:serverData.data.data.user_id}})
			}else{
				ElMessage({message:serverData.data.msg,type:'error',showClose:true})
				
			}
		})
		
		
		
	  
	  
	}
</script>

<style>
</style>